<template>
  <el-button
    v-for="item in list"
    :key="item.prop"
    :type="item.type"
    :link="item.prop == 'edit' || item.prop == 'delete'"
    style="margin: 10px 5px"
    @click="handleClick(item.prop)"
  >
    <img
      :src="item.img"
      v-if="item.img"
      style="width: 16px; margin-right: 5px"
    />
    {{ item.label }}</el-button
  >
</template>

<!-- vue3 按钮组件 -->
<script setup>
import { defineProps, defineEmits } from "vue";

let props = defineProps({
  /**
   * 按钮配置
   */
  list: {
    type: Array,
    default: () => {},
  },
  /**
   * 渲染的数据（表格的row）
   */
  data: {
    type: Object,
    default: () => {},
  },
});

const emits = defineEmits(["handleClick"]);

function handleClick(prop) {
  const row = {
    prop,
    data: props.data,
  };
  // console.log(2121, row);
  emits("handleClick", row);
}
</script>

<style scoped lang="scss"></style>
